<template>
	<view class="contract-detail" v-if="contractDetail !== ''">
		<view class="detail-list">
			<view class="detail-list-item flex-center-between">
				<view class="detail-list-item-name">甲方</view>
				<view class="detail-list-item-txt">
					{{contractDetail.first_party.name}}
				</view>
			</view>
			<view class="detail-list-item flex-center-between">
				<view class="detail-list-item-name">乙方</view>
				<view class="detail-list-item-txt">
					{{contractDetail.second_party.name}}
				</view>
			</view>
			<view class="detail-list-item flex-center-between">
				<view class="detail-list-item-name">甲方法人</view>
				<view class="detail-list-item-txt">
					{{contractDetail.first_party.agent}}
				</view>
			</view>
			<view class="detail-list-item flex-center-between">
				<view class="detail-list-item-name">签订日期</view>
				<view class="detail-list-item-txt">
					{{contractDetail.first_party.sign_date}}
				</view>
			</view>
			<view class="detail-list-item flex-center-between">
				<view class="detail-list-item-name">地址</view>
				<view class="detail-list-item-txt">
					{{contractDetail.first_party.address}}
				</view>
			</view>
			<view class="detail-list-item flex-center-between">
				<view class="detail-list-item-name">合同编号</view>
				<view class="detail-list-item-txt">
					{{contractDetail.orderInfo.order_no}}
				</view>
			</view>
		</view>
		<view class="agreement">
			查看
			<text class="color-important" @click="previewDocument">《合同条例》</text>
		</view>
	</view>
</template>

<script>
	export default {
		components: {
		},
		data() {
			return {
				contractDetail: {}
			}
		},
		onLoad(option) {
			this.getContractDetail(option.contractId)
		},
		methods: {
			/**
			 * 获取详情
			 * @param {String} id
			 */
			async getContractDetail(id) {
				let res = await this.$http.request({
					method: 'post',
					url: '/api/contract/detail',
					data: { id: id }
				})
				if (res.status === 1) {
					if (res.data === '') {
						uni.showModal({
							title: '提示',
							content: '合同不存在，是否返回上一页？',
							success: function (res) {
								if (res.confirm) {
									uni.navigateBack()
								}
							}
						})
					}
					this.contractDetail = res.data
				} else {
					uni.showToast({
						title: res.message,
						icon: 'none',
						duration: 3000
					})
				}
			},
			/**
			 * @desc 预览合同文件
			 */
			previewDocument(){
				let url = 'https://lease.litree.mixiot.top/uploads/controct.pdf'
				uni.showLoading({
				    title: '加载中...'
				});
				uni.downloadFile({
				  url: url,
				  success: function (res) {
				    var filePath = res.tempFilePath;
				    uni.openDocument({
				      filePath: filePath,
				      success: function (res) {
						uni.hideLoading();
				        console.log('打开文档成功');
				      }
				    });
				  }
				});
			}
		}
	}
</script>

<style lang="scss">
	.contract-detail{
		.detail-list{
			background: $uni-bg-color-grey;
			&-item{
				background: $uni-bg-color;
				min-height: 110rpx;
				padding: 0 50rpx;
				border-bottom: 1rpx solid $uni-border-color;
			}
		}
		.agreement{
			text-align: right;
			line-height: 100rpx;
			margin-right: 30rpx;
			color: $uni-text-color-grey;
			font-size: $uni-font-size-sm;
			.checkbox-group{
				display: inline-block;
			}
		}
	}
</style>
        